<template>
    <div>
        <div v-if="mode === 'DESIGN'">
            <el-input disabled type="textarea" style="white-space: pre-line; word-break: break-all;"
                :placeholder="$t(placeholder)" :maxlength="maxlength" />
        </div>
        <div v-else-if="mode === 'PC' && !readonly">
            <el-input clearable style="white-space: pre-line; word-break: break-all;" v-model="_value"
                :placeholder="$t(placeholder)" :maxlength="maxlength">
                <template #append v-if="enableScan">
                    <el-button @click="scanCode" icon="fullScreen"></el-button>
                </template>
            </el-input>
            <scan-code pcMode v-model="visible" @ok="scanOk"></scan-code>
        </div>
        <div v-else-if="mode === 'MOBILE' && !readonly">
            <field v-model="_value" style="white-space: pre-line; word-break: break-all;" clearable
                :placeholder="$t(placeholder)" :maxlength="maxlength">
                <template #right-icon v-if="enableScan">
                    <el-icon @click="scanCode">
                        <FullScreen />
                    </el-icon>
                </template>
            </field>
            <scan-code v-model="visible" @ok="scanOk"></scan-code>
        </div>
        <div v-else>
            <!-- {{ _value }} -->
            <el-input clearable v-model="_value" :disabled="readonly" :maxlength="maxlength">
                <template #append v-if="enableScan">
                    <el-button @click="scanCode" icon="fullScreen"></el-button>
                </template>
            </el-input>
        </div>
    </div>
</template>

<script>
import componentMinxins from '../ComponentMinxins'
import { Field } from 'vant'
import ScanCode from '@/components/common/ScanCode.vue'
import { getRimbur } from '@/api/Reimbursement.js'
export default {
    mixins: [componentMinxins],
    name: 'Reimbursement',
    components: { Field, ScanCode },
    props: {
        modelValue: {
            type: String,
            default: null,
        },
        placeholder: {
            type: String,
            default: 'webAuto.enterContent',
        },
        enableScan: {
            type: Boolean,
            default: false,
        },
        defaultValue: {
            type: String,
            default: '',
        },
        maxlength: {
            type: Number,
            default: 255,
        },
        formData: {
            type: Object,
            default: () => {
                return {}
            },
        },
        optionText: {
            type: Array,
            default: () => {
                return []
            },
        },
        tables: {
            type: String,
            default: '',
        },
        index: {
            type: Number,
            default: 0,
        },
    },
    data() {
        return {
            visible: false,
            listValue: {}
        }
    },
    computed: {
        watchedField() {
            let seat = this.optionText.filter(x => x.name == '座位')[0]
            let vehicle = this.optionText.filter(x => x.name == '交通工具')[0]
            let project = this.optionText.filter(x => x.name == '财务报销项目')[0]
            let city = this.optionText.filter(x => x.name == '城市')[0]
            let province = this.optionText.filter(x => x.name == '省份')[0]
            let evection = this.optionText.filter(x => x.name == '出差天数')[0]
            let reporting = this.optionText.filter(x => x.name == '实报金额(交易货币)')[0]
            let audit = this.optionText.filter(x => x.name == '审核金额(交易货币)')[0]
            if (this.formData[this.tables]) {
                return {
                    seat: this.formData[this.tables][this.index - 1 > 0 ? this.index - 1 : 0][seat.value],
                    vehicle: this.formData[this.tables][this.index - 1 > 0 ? this.index - 1 : 0][vehicle.value],
                    project: this.formData[this.tables][this.index - 1 > 0 ? this.index - 1 : 0][project.value],
                    evection: this.formData[this.tables][this.index - 1 > 0 ? this.index - 1 : 0][evection.value],
                    city: this.formData[this.tables][this.index - 1 > 0 ? this.index - 1 : 0][city.value],
                    province: this.formData[this.tables][this.index - 1 > 0 ? this.index - 1 : 0][province.value],
                    reporting: this.formData[this.tables][this.index - 1 > 0 ? this.index - 1 : 0][reporting.value],
                    audit: this.formData[this.tables][this.index - 1 > 0 ? this.index - 1 : 0][audit.value]
                };
            }
        }
    },
    watch: {
        async watchedField(newVal, oldVal) {
            let declarant = this.optionText.filter(x => x.name == '供应商')[0]
            let supplierCode = this.optionText.filter(x => x.name == '供应商编码')[0]
            await getRimbur({
                pageSize: 99999,
                currentPage: 1,
                code: this.formData[supplierCode.value] || JSON.parse(localStorage.getItem('loginUser'))?.id,
                value: this.formData[declarant.value] || JSON.parse(localStorage.getItem('loginUser'))?.name,
                typeCode: 'CaiLvBXBZ', //差旅报销标准
            }).then(rsp => {
                this.listValue = rsp.data.data.length > 0 ? rsp.data.data[0] : {}
            })

            let seat = this.optionText.filter(x => x.name == '座位')[0]
            let vehicle = this.optionText.filter(x => x.name == '交通工具')[0]
            let project = this.optionText.filter(x => x.name == '财务报销项目')[0]
            let reporting = this.optionText.filter(x => x.name == '实报金额(交易货币)')[0]
            let audit = this.optionText.filter(x => x.name == '审核金额(交易货币)')[0]
            let grossAmount = this.optionText.filter(x => x.name == '总金额(交易货币)')[0]
            let standard = this.optionText.filter(x => x.name == '超标提示')[0]
            let evection = this.optionText.filter(x => x.name == '出差天数')[0]
            let cityType = this.optionText.filter(x => x.name == '城市类型')[0]
            let city = this.optionText.filter(x => x.name == '城市')[0]
            let province = this.optionText.filter(x => x.name == '省份')[0]

            this.formData[this.tables].forEach(element => {

                if (element[project.value] == '差旅-交通费' && Object.keys(this.listValue).length > 0) {

                    // 飞机 attribute13   动车/高铁 attribute14  普通火车   attribute15  轮船   attribute16
                    let a = (element[seat.value] == this.listValue?.attribute13 && element[vehicle.value] == '飞机') ? '---' : '配置飞机舱位:' + this.listValue.attribute13 + ',填报舱位:'+element[seat.value]
                    let b = (element[seat.value] == this.listValue?.attribute14 && element[vehicle.value] == '动车/高铁') ? '---' : '配置高铁座位:' + this.listValue.attribute14 + ',填报座位:'+element[seat.value]
                    let c = (this.listValue?.attribute15?.indexOf(element[seat.value]) != -1 && element[vehicle.value] == '普通火车') ? '---' : '配置普通火车座位:' + this.listValue.attribute15 + '填报座位:' + element[seat.value] + ';'
                    let d = (element[seat.value] == this.listValue?.attribute16 && element[vehicle.value] == '轮船') ? '---' : '配置轮船舱位:' + this.listValue.attribute16 + ',填报舱位:'+element[seat.value]

                    let e = element[vehicle.value] == '市内出租车' ? this.extractPercentage(this.listValue?.attribute17) : 100  // 报销百分比,按照总金额去计算
                    let f = (element[grossAmount.value] * (e / 100) < element[audit.value] && element[grossAmount.value] * (e / 100) < element[reporting.value]) ? '出租车金额超标,填报比例:' + e + '%;报销金额为' + element[grossAmount.value] * (e / 100) : '---'

                    // 赋值给表格
                    element[standard.value] = element[vehicle.value] == '飞机' ? a : element[vehicle.value] == '动车/高铁'
                        ? b : element[vehicle.value] == '普通火车' ? c : element[vehicle.value] == '轮船'
                            ? d : element[vehicle.value] == '市内出租车' ? f : '未配置报销标准';

                } else if (element[project.value] == '差旅-住宿费' && Object.keys(this.listValue).length > 0) {

                    // 北上广深住宿 attribute5   省会城市住宿 attribute6  地级市住宿   attribute7  县级市住宿   attribute8
                    // 计算金额
                    let auditer = this.listValue?.attribute5 > element[audit.value] && this.listValue?.attribute5 > element[reporting.value]
                    let auditer2 = this.listValue?.attribute6 > element[audit.value] && this.listValue?.attribute6 > element[reporting.value]
                    let auditer3 = this.listValue?.attribute7 > element[audit.value] && this.listValue?.attribute7 > element[reporting.value]
                    let auditer4 = this.listValue?.attribute8 > element[audit.value] && this.listValue?.attribute8 > element[reporting.value]
                    // 对比是那个类型
                    let a = (auditer && element[cityType.value] == '北上广深') ? '---' : '住宿金额超标,北上广深城市标准为：' + this.listValue?.attribute5
                    let b = (auditer2 && element[cityType.value] == '省会城市') ? '---' : '住宿金额超标,省会城市标准为：' + this.listValue?.attribute6
                    let c = (auditer3 && element[cityType.value] == '地级城市') ? '---' : '住宿金额超标,地级市城市标准为：' + this.listValue?.attribute7
                    let d = (auditer4 && element[cityType.value] == '县级市') ? '---' : '住宿金额超标,县级市城市标准为：' + this.listValue?.attribute8

                    element[standard.value] = element[cityType.value] == '北上广深' ? a :
                        element[cityType.value] == '省会城市' ? b
                            : element[cityType.value] == '地级城市' ? c : element[cityType.value] == '县级市' ? d : '未配置报销标准'

                } else if (element[project.value] == '差旅-差旅津贴' && Object.keys(this.listValue).length > 0) {

                    // 北上广深差旅补贴 attribute9  省会城市差旅补贴 attribute10  地级市差旅补贴   attribute11  县级市差旅补贴   attribute12
                    // 计算金额  evection 出差天数
                    let auditer = this.listValue?.attribute9 > element[audit.value] * element[evection.value] && this.listValue?.attribute9 > element[reporting.value] * element[evection.value]
                    let auditer2 = this.listValue?.attribute10 > element[audit.value] * element[evection.value] && this.listValue?.attribute10 > element[reporting.value] * element[evection.value]
                    let auditer3 = this.listValue?.attribute11 > element[audit.value] * element[evection.value] && this.listValue?.attribute11 > element[reporting.value] * element[evection.value]
                    let auditer4 = this.listValue?.attribute12 > element[audit.value] * element[evection.value] && this.listValue?.attribute12 > element[reporting.value] * element[evection.value]
                    // 对比是那个类型
                    let a = (auditer && element[cityType.value] == '北上广深') ? '---' : '差旅津贴超标,北上广深城市标准为：' + this.listValue?.attribute9 + ' /天'
                    let b = (auditer2 && element[cityType.value] == '省会城市') ? '---' : '差旅津贴超标,省会城市标准为：' + this.listValue?.attribute10 + ' /天'
                    let c = (auditer3 && element[cityType.value] == '地级城市') ? '---' : '差旅津贴超标,地级市城市标准为：' + this.listValue?.attribute11 + ' /天'
                    let d = (auditer4 && element[cityType.value] == '县级市') ? '---' : '差旅津贴超标,县级市城市标准为：' + this.listValue?.attribute12 + ' /天'

                    element[standard.value] = element[cityType.value] == '北上广深' ? a :
                        element[cityType.value] == '省会城市' ? b
                            : element[cityType.value] == '地级城市' ? c : element[cityType.value] == '县级市' ? d : '未配置报销标准'

                } else {
                    element[standard.value] = '非超标判断类型'
                }

            });
        },
        deep: true
    },
    // 给页面添加默认值
    mounted() {
        if (this.defaultValue && !this.modelValue) {
            this._value = this.defaultValue;
            this.$emit('update:modelValue', this.defaultValue);
        }

    },
    methods: {
        scanCode() {
            this.visible = true
        },
        scanOk(code) {
            this._value = code
            showSuccessToast(this.$t('webAuto.ScanCodeSuccessfully'))
        },
        extractPercentage(str) {
            const match = str.match(/(\d+)%/);
            if (match && match[1]) {
                return parseInt(match[1], 10); // 返回数字 70
            }
            return null; // 如果没有找到匹配项返回 null
        }
    },
    emits: ['update:modelValue'],
}
</script>

<style lang="less" scoped></style>